<template>
  <h1 v-if="route.path==='/home/addregnus'">添加药品</h1>
  <h1 v-else>修改挂号数</h1>
  <el-form
    :model="form.data"
    :rules="rules"
    ref="ruleFormRef"
    :hide-required-asterisk="true"
    label-width="120px">


    <el-row>
      <el-col :span="6">
        <el-form-item label="科室" prop="departmentId">
          <el-select v-model="form.data.departmentId" placeholder="请选择所属科室"
                     :clearable="true"
                     @change="getEmployeesOptionData">
            <el-option v-for="item in departments.data"
                       :key="item.departmentId"
                       :label="item.departmentName"
                       :value="item.departmentId" />
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="6">
        <el-form-item label="就诊医生" prop="employeeId">
          <el-select v-model="form.data.employeeId" placeholder="请选择就诊医生" :clearable="true">
            <el-option v-for="item in employees.data"
                       :key="item.employeeId"
                       :label="item.employeeName"
                       :value="item.employeeId" />
          </el-select>
        </el-form-item>
        </el-col>
    </el-row>

    <el-form-item label="上午挂号数" prop="pmNumber">
      <el-input v-model="form.data.pmNumber" placeholder="请输入上午挂号数" style="width: 218px;" />
    </el-form-item>

    <el-form-item label="下午挂号数" prop="amNumber">
      <el-input v-model="form.data.amNumber" placeholder="请输入下午挂号数" style="width: 218px;" />
    </el-form-item>


    <el-form-item label="使用日期" style="width:330px" prop="useTime">
      <el-date-picker
        v-model="form.data.useTime"
        type="date"
        placeholder="请选择日期"
        style="width:300px;"
        format="YYYY/MM/DD"
        value-format="YYYY-MM-DD"
      />
    </el-form-item>


    <el-form-item>
      <el-button  type="primary" @click="onSubmit(ruleFormRef)" v-if="route.path==='/home/addregnus'">添加</el-button>
      <el-button v-else type="primary" @click="onSubmit(ruleFormRef)">修改</el-button>
      <el-button @click="reset">重置</el-button>
    </el-form-item>
  </el-form>

</template>

<script lang="js" setup>
import { onMounted, reactive, ref, toRaw, toRefs, unref } from "vue";
import { getDepartmentNameId, getEmployeeByDid } from "@/utils/api";
import { addRegnus, getRegnus, getRegnusOne, updateRegnus } from "@/utils/RegnusRequest";
import { ElMessage, ElMessageBox } from "element-plus";
import { useRoute } from "vue-router";
import router from "@/router";

const route = useRoute();

const form = reactive({
  data: {
    "departmentId": "",
    "employeeId": "",
    "pmNumber": 10,
    "amNumber": 10,
    "regNusId": "",
    "useTime": ""
  }
});


//表单校验规则
const rules = reactive({
  medicineName: [
    { required: true, message: "请输入药品名称", trigger: "blur" },
    {min:2,max:10,message: "药品名称长度为2~10", trigger: "blur"}
  ],
  number: [
    { required: true, message: "请输入药品录入的数量", trigger: "blur" },
  ],
  medicineType: [
    { required: true, message: "请输入药品类型", trigger: "blur" },
  ],
  unit: [
    { required: true, message: "请输入单位", trigger: "blur" },
  ],
  price: [
    { required: true, message: "请输入药品的价格", trigger: "blur" },
  ],

});


const departments = reactive({
  data: []
});

const employees = reactive({
  data: []
});

const ruleFormRef = ref();




//重置
const reset = () => {
  form.data = {}
}

onMounted(() => {
  getDepartmentOptionData();
  if (route.path !== '/home/addregnus'){
    getMedicineData();
  }
});


//发送添加请求
const addregnusRequest = async (fromDate) => {
  let res = await addRegnus(fromDate);
  if (res.data) {
    ElMessage({
      type: "success",
      message: "添加成功成功"
    });
    router.push({
      path:'/home/regnus'
    })
  }
};




//获取部门菜单的数据
const getDepartmentOptionData = async () => {
  let res = await getDepartmentNameId();
  departments.data = res.data;
};

//根据部门查找医生
const getEmployeesOptionData = async (id) => {
  form.data.employeeId="";
  let res = await getEmployeeByDid(id);
  employees.data = res.data;
};



//回显要修改员工的数据
const getMedicineData = async () =>{
  let res = await getRegnusOne(route.query.id)
  let id = res.data.employeeId;
  form.data = res.data
  if (route.path !== '/home/addregnus'){
    getEmployeesOptionData(form.data.departmentId)
  }
  form.data.employeeId=id
}



//提交表单的回调
const onSubmit = (formEl) => {
  if (!formEl) return;
  formEl.validate(async (valid) => {
    if (!valid) {
      return false;
    } else {
      //发送请求
      if (route.path==='/home/addregnus'){
        addregnusRequest(form.data);
      }else {
        ElMessageBox.confirm(
          "确定要修改吗?",
          "警告",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }
        )
          .then(async () => {
            //发送修改的请求
            let res = await updateRegnus(form.data);
            if (res.data) {
              ElMessage({
                type: "success",
                message: "修改成功"
              });
              router.push({
                path:'/home/regnus'
              })
            } else {
              ElMessage({
                type: "error",
                message: "修改失败"
              });
            }
          })
          .catch(() => {
            ElMessage({
              type: "info",
              message: "取消修改"
            });
          });
      }
    }
  });
};

</script>


<style scoped>
</style>